<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<title>模块添加</title>

		<link rel="stylesheet" type="text/css" href="/admin/css/iconfont.css" />
		<link rel="stylesheet" type="text/css" href="/admin/css/bootstrap.min.css"/>
		<link rel="stylesheet" type="text/css" href="/admin/css/bootstrap-table.min.css"/>
		<link rel="stylesheet" type="text/css" href="/admin/css/style.min.css" />
		<link rel="stylesheet" type="text/css" href="/admin/layui/css/layui.css">

		<script src="/admin/js/jquery-3.3.1.min.js"></script>
		<script src="/admin/layui/layui.js" charset="utf-8"></script>
		
		<link rel="stylesheet" href="/lib/zTree/css/zTreeStyle/zTreeStyle.css" type="text/css">
		<link rel="stylesheet" href="/admin/css/ztree_select.css" type="text/css">
		<script type="text/javascript" src="/lib/zTree/js/jquery.ztree.core-3.5.js"></script>
		<script type="text/javascript" src="/lib/zTree/js/jquery.ztree.excheck-3.5.js"></script>
		<script type="text/javascript" src="/lib/zTree/js/jquery.ztree.exedit-3.5.js"></script>
		
		<script src="/admin/js/api.js" charset="utf-8"></script>
		<script src="/admin/js/base.js" charset="utf-8"></script>
		<script src="/admin/js/common.js"></script>
		<script src="/admin/js/style.js"></script>
        <script src="/admin/js/tree.js"></script>

	</head>

	<body>
		<div class="tab-content form-content">
			<div class="rigthContent">
				<form class="layui-form layui-form-content" lay-filter="add_form" action="">
					<div class="tab-content form-content">
						<div class="row tab-pane active" role="tabpanel" id="form-tab1">
							<div class="col-sm-12">
								<div class="ibox float-e-margins">
									<div class="" >
										<div class="layui-form-item">
											<div class="layui-inline width-100">
												<label class="layui-form-label">父级栏目：</label>
												<div class="layui-input-block layui-input-inline-tree">
													<div class="layui-form-select">
														<div class="layui-select-title">
															<input placeholder="顶级栏目" id="parentName" name="parentName" value="顶级栏目" class="layui-input" type="text" autocomplete="off">
															<i class="layui-edge"></i>
														</div>
													</div>
													<div class="selectTreeContent treeContent">
														<div class="manageeditdiv">
															<ul id="treeDemo" class="ztree" style="margin-top: 0px;  -moz-user-select: none;"></ul>
														</div>
													</div>
												</div>
											</div>
										</div>
										<div class="layui-form-item">
											<div class="layui-inline width-100">
												<label class="layui-form-label">名字：</label>
												<div class="layui-input-block">
													<input type="name" id="name" name="name" lay-verify="required" autocomplete="off" class="layui-input">
												</div>
											</div>
										</div>
										<div class="layui-form-item">
											<div class="layui-inline width-100">
												<label class="layui-form-label">链接：</label>
												<div class="layui-input-block">
													<input type="url" id="url" name="url" autocomplete="off" class="layui-input" value="">
												</div>
											</div>
										</div>
										<div class="layui-form-item">
											<div class="layui-inline width-100">
												<label class="layui-form-label">显示为菜单：</label>
												<div class="layui-input-block">
													<input type="radio" class="yesShow" lay-filter="showMenu" name="showMenu" value="1" title="是" checked="checked">
													<input type="radio" class="noShow" lay-filter="showMenu" name="showMenu" value="0" title="否">
												</div>
											</div>
										</div>
										<div class="layui-form-item menu-div">
											<div class="layui-inline width-100">
												<label class="layui-form-label">菜单图标：</label>
												<div class="layui-input-block" id="menu">
												</div>
											</div>
										</div>
									</div>
								</div>
							</div>
						</div>
					</div>
					<div class="layui-form-submit">
						<input type="hidden" name="parentId" id="parentId" value="">
						<button id="save" type="button" class="layui-btn" lay-submit="" lay-filter="save" id="save">提交</button>
						<a class="layui-btn handle_back" onclick="toClose()">取消</a>
					</div>
				</form>
			</div>
		</div>

		<script>

			var id = getParam("id");
			var parentId = getParam("parentId");
			var update = getParam("update");
			var treeNodeJson = JSON.parse(getParam("treeNodeJson", "{}"));

			treeOption = {
				treeList : Url.creatUrl(Api.admin.base.baseModule.getBaseModuleTreeList),
				selectTree: 1,
				justTree: 1
			};

			layuiReady (function() {
				_loading();

				if (update) {
					//编辑的时候，带上parentId
					initParent(parentId);
					dataView(id);
				} else {
					//添加的时候，当前id作为父级id
					initParent(id);
					initMenu();
				}

				//监听提交
				layform.on('submit(save)', function(data) {
					data = data.field;
					if (update) {
						//编辑的时候，设置id
						data.id = id;
					}
					if (data.url) {
						data.url = data.url.replace(/&/g, '!and!');
					}
					layer.confirm("确定提交吗？", {
						btn: ['确定', '取消']
					}, function(index) {
						This.jqueryAjax(Api.admin.base.baseModule.addBaseModule, data, "json", function(data) {
							if (data.status == 1) {
								//关闭弹出框
								parent_receive(data.message);

								var dataObj = data.object;
								var name = dataObj.name;
								var id = dataObj.moduleId;
								var pId = dataObj.parentId;
								var isTop = false;
								if (!pId || pId == '0') {
									isTop = true;
								}
								if (update) {
									treeNodeJson.name = name;
									getTopParent().updateNode(treeNodeJson);
								} else {
									getTopParent().addNode(name, id, pId, isTop);
								}
								toClose();
							} else {
								parent_receive(data.message);
								reSubmit();
							}
						});
					});
					return;
				});
				_loadingClose();
			});

			function initParent (id) {
				This.jqueryAjax(Api.admin.base.baseModule.getBaseModuleById, {id: id}, "json", function (data) {
					if (data.status == 1 && data.object) {
						$("#parentId").val(id);
						$("#parentName").val(data.object.name);
					}
				});
			}

			function dataView (id) {
				This.jqueryAjax(Api.admin.base.baseModule.getBaseModuleById, {id: id}, "json", function (data) {
					if (data.status == 1) {
						valData(data.object);
						$("input[name='isShowMenu'][value='" + data.object.isShowMenu + "']").attr('checked', true);
						initMenu(data.object.style);
					}
				});
			}

			function initMenu(_style) {
				var html = "";
				var styles = style();
				for (var i = 0; i < styles.length; i++) {
					if (_style) {
						if (_style && styles[i] == _style) {
							html += "<input type=\"radio\" name=\"style\" value='" + styles[i] + "' title=\"<i class='" + styles[i] + "'></i>\" checked=\"checked\">";
						} else {
							html += "<input type=\"radio\" name=\"style\" value='" + styles[i] + "' title=\"<i class='" + styles[i] + "'></i>\">";
						}
					} else {
						if (i == 0) {
							html += "<input type=\"radio\" name=\"style\" value='" + styles[i] + "' title=\"<i class='" + styles[i] + "'></i>\" checked=\"checked\">";
						} else {
							html += "<input type=\"radio\" name=\"style\" value='" + styles[i] + "' title=\"<i class='" + styles[i] + "'></i>\">";
						}
					}
				}
				$("#menu").html(html);
				layform.render();
			}

		</script>

	</body>

</html>